<template>
  <view>
    <view class="search_box">
      <image
        src="../../../static/s1.png"
        class="goback"
        @click="back"
        mode="widthFix"
      ></image>
      <text class="topicText">实名认证</text>
    </view>
    <view class="" style="padding-top: 110rpx">
      <image
        src="../../../static/user/authentication.png"
        mode="widthFix"
        style="width: 100%"
      ></image>
    </view>
    <view class="classname">
      <view class="title">姓名: </view>
      <input
        type="text"
        class="xingmin"
        v-model="name"
        placeholder="请输入您的真实姓名"
      />
    </view>
    <view class="ID">
      <view class="title">身份证: </view>
      <input
        type="number"
        v-model="cardNum"
        placeholder="请输入您的身份证号码"
      />
    </view>
    <button type="default" class="btn" @click="confirm">提交</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      name: "",
      cardNum: "",
    };
  },
  methods: {
    back() {
      uni.switchTab({
        url: "../user",
      });
    },
    // 实名认证
    async confirm() {
      if (this.name == "") {
        uni.showToast({
          title: "请输入您的真实姓名",
          icon: "none",
        });
        return;
      }
      if (this.cardNum == "") {
        uni.showToast({
          title: "请输入您的身份证号码",
          icon: "none",
        });
        return;
      }
      let that = this;
      const res = await that.$myRequest({
        url: "user/authentication",
        method: "POST",
        data: {
          name: this.name,
          cardNum: this.cardNum,
        },
      });
      if (res.data.code == 1) {
        this.name = "";
        this.cardNum = "";
        uni.showToast({
          title: res.data.msg,
          icon: "none",
        });
      } else {
        uni.showToast({
          title: res.data.msg,
          icon: "none",
        });
      }
    },
  },
};
</script>

<style lang="scss">
page {
  background-color: #eeeeee;
}
.classname {
  display: flex;
  padding: 20rpx 0 20rpx 26rpx;
  background-color: #ffffff;
  border-bottom: 1rpx dashed #707070;
}

.ID {
  display: flex;
  align-items: center;
  padding: 20rpx 0 20rpx 26rpx;
  background-color: #ffffff;
}
.title {
  width: 120rpx;
}
.btn {
  width: 650rpx;
  height: 83rpx;
  background-color: #c52b2e;
  line-height: 83rpx;
  color: #ffffff;
  border-radius: 150rpx;
  margin-top: 100rpx;
}
</style>
